/* 清除浮动 */
.clearfix:after, .clearfix:before {
    content: " ";
    display: table
}

.clearfix:after {
    clear: both
}

/* 聊天最外层 */
.chat {
    width: 100%;
    display: block;
    min-height: 300px;
}

.chat .top > div {
    border: 1px solid #d5e0e3;
    min-height: 120px;
}

/* 输入框 */
#data {
    float: left;
    width: 69.6%;
    min-height: 100px;
}

/* 用户列表 */
#user_list {
    width: 29.6%;
    float: left;
    min-height: 100px;
}

#user_list p {
    display: block;
    /*width: 95%;*/
    /*margin-left: 5%;*/
    margin-bottom: 1px;
    /*border: 1px solid #bbe3df;*/
}

#user_list p:nth-child(odd) {
    background: #e6eff7;
}

#user_list p:nth-child(even) {
    background: #fde4e4;
}

#user_list p img {
    width: 38px;
    float: left;
    border-radius: 2px;
}

#user_list p span {
    float: left;
    color: #1E9FFF;
}
.user_chosen {
    color: #9370db !important;
}


/* 聊天记录 */
.chat_username {
    font-size: 14px;
    color: #1E9FFF;
}

.textarea {
    display: block;
    float: left;
    width: 49.5%;
    height: 40%;
    position: relative;
    padding: 0;
}

.msg_box {
    height: 180px;
    overflow: auto;
}

.note {
    margin: 0;
    padding: 0;
    width: 100%;
    text-align: center;
    display: block;
    color: #F3F3F3;
}

.note-public {
    background: #1E9FFF;
}

.note-private {
    background: #9370db;
}


/* 按钮 */
.tool-bar {
    display: block;
    margin: 0 10%;
    float: left;
}

.tool-bar button {
    float: left;
}

#close-link {
    display: none;
}

.leave_msg {
    color: #ff5722;
}

.layui-btn-purple {
    background: #9370db;
}